<template>

  <div>
    <Button>Default</Button>
    <Button type="primary">Primary</Button>
    <Button type="success">Success</Button>
    <Button type="info">Info</Button>
    <Button type="warning">Warning</Button>
    <Button type="danger">Danger</Button>
  </div>
  <div>
    <Button plain>Plain</Button>
    <Button plain type="primary">Primary</Button>
    <Button plain type="success">Success</Button>
    <Button plain type="info">Info</Button>
    <Button plain type="warning">Warning</Button>
    <Button plain type="danger">Danger</Button>
  </div>
  <div>
    <Button round>round</Button>
    <Button round type="primary">Primary</Button>
    <Button round type="success">Success</Button>
    <Button round type="info">Info</Button>
    <Button round type="warning">Warning</Button>
    <Button round type="danger">Danger</Button>
  </div>
  <div>
    <Button icon="fa-car"> round</Button>
    <Button icon="fa-car" type="primary"></Button>
    <Button icon="fa-car" type="success"></Button>
    <Button icon="fa-car" type="info"></Button>
    <Button icon="fa-car" type="warning"></Button>
    <Button icon="fa-car" type="danger"></Button>
  </div>
</template>

<script setup lang="ts">
import Button from "@/components/Button/Button.vue";

</script>
<style scoped>
div {
  margin: 15px 0px;
}
</style>
